<template>
	<view class="page_wrapper">
		<Navbar title="答题完成"></Navbar>
		<view class="pagebox">
			<view class="first_block">
				<image class="firstImg" src="https://www.hzif.cn/mathematics-attach/test_finsh.png" mode=""></image>
			</view>
			<view class="score_block">
				<view class="score_ctx">
					<view class="count">
						<span class="gb">{{totalCount}}</span>
						<span class="tip">总题数</span>
					</view>
					<view class="truenum">
						<span class="gb">{{mathExam.accuracy+'%'}}</span>
						<span class="tip">正确率</span>
					</view>
					<view class="time">
						<span class="gb">{{gettime(mathExam.useTimeTxt)}}</span>
						<span class="tip">总用时</span>
					</view>
				</view>
				<view>
					<button class="showbtn" @click="handleToShow()">查看试题</button>
				</view>
			</view>
		</view>
		
		<view class="return_index" @tap="redirectIndex()">
			返回首页
		</view>
		<image class="page_bg_img" src="../../../static/nimg/bg.png" mode=""></image>
	</view>
</template>

<script>
	import {request} from '@/utils/request.js'
	import {utils} from '@/utils/utils.js'
	import {storageData} from '@/utils/storageData.js'
	import Navbar from '@/components/navbar.vue'
	export default {
		components:{
			Navbar
		},
		data() {
			return {
				examId: 0,
				mathExam: {},
				totalCount:0,
				createWinFlag: false
			}
		},
		onLoad(option) {
			console.log(option);
			this.examId = option.examId
			this.fetchData()
		},
		methods: {
			fetchData() {
				uni.showLoading()
				let that = this
				uni.getStorage({
					key:'test_score',
					success(res) {
						uni.hideLoading()
						if(res.errMsg ==="getStorage:ok"){
							that.mathExam = JSON.parse(res.data)
						}else{
							uni.hideLoading()
						}
					},
					fail() {
						uni.hideLoading()
					}
				})
				uni.getStorage({
					key:this.examId,
					success(res) {
						if(res.errMsg ==="getStorage:ok"){
							that.totalCount = JSON.parse(res.data).length
						}
					}
				})
			},
			handleToShow() {
				uni.navigateTo({
					url: '/pages/mathExam/showMyTwoOptExam?examId=' + this.examId
				})
			},
			gettime(str){
				let h,m,s,M
				s = Number(str)%60
				M = Math.floor(Number(str)/60)
				h = Math.floor(Number(M)/60)
				m = Math.floor(Number(M)%60)
				m = m<10?'0'+m:m
				s = s<10?'0'+s:s
				if(h!=0){
					h = h<10?'0'+h:h
					return h+':'+m+':'+s
				}else{
					return m+':'+s
				}
			},
			redirectIndex: function() {
				uni.removeStorageSync(this.examId)
				uni.redirectTo({
					url: '/pages/index/index'
				})
			},
		},
		// onShareAppMessage(res) {
		// 	const userInfo = storageData.getLoginUser()
		// 	const title = this.mathExam.calcTotalCount + '道口算我用了' + this.mathExam.useTimeTxt + ',成绩是:' + this.mathExam.score + '分，你要测试一下吗？'
			
		// 	if (res.from === 'button') {
		// 		 // 来自页面内分享按钮
		// 		 console.log("------------------------")
		// 		 console.log(res.target);
		// 		 console.log("------------------------")
		// 		 if(res.target.id === 'win'){
		// 			 // 擂台分享
		// 			 return {
		// 			 	title: title ,
		// 			 	path: '/pages/mathExamWin/mathExamWin?examId=' + this.examId + '&shareUc=' + userInfo.userCode,
		// 			 	mpId: 'wxcbbe1a868c5c3c3c', //此处配置微信小程序的AppId
		// 			 }
		// 		 }
		// 	}
		// 	return {
		// 		title: title ,
		// 		path: '/pages/shareExam/shareExam?examId=' + this.examId + '&shareUc=' + userInfo.userCode,
		// 		mpId: 'wxcbbe1a868c5c3c3c', //此处配置微信小程序的AppId
		// 	}
		// },
		// onShareTimeline(res) {
		// 	const userInfo = storageData.getLoginUser()
		// 	const title = this.mathExam.calcTotalCount + '道口算我用了' + this.mathExam.useTimeTxt + ',成绩是:' + this.mathExam.score + '分，你要测试一下吗？'
		// 	return {
		// 		title: title ,
		// 		path: '/pages/shareExam/shareExam?examId=' + this.examId + '&shareUc=' + userInfo.userCode,
		// 		mpId: 'wxcbbe1a868c5c3c3c', //此处配置微信小程序的AppId
		// 	}
		// },
	}
</script>

<style lang="scss" scoped>
	.page_wrapper{
		.first_block{
			display: flex;
			justify-content: center;
			position: relative;
			z-index: 5;
			.firstImg{
				width: 90%;
				height: 600rpx;
			}
		}
		.score_block{
			position: relative;
			display: flex;
			flex-direction: column;
			justify-content: flex-end;
			row-gap: 40rpx;
			padding-bottom: 60rpx;
			background-color: #C4E6C2;
			border-radius: 20rpx;
			height: 540rpx;
			top: -320rpx;
		}
		.score_ctx{
			display: flex;
			justify-content: space-around;
			text-align: center;
			.gb{
				color:#36AC7A ;
				font-size: 48rpx;
				font-weight: 800;
			}
			.tip{
				color: #50974B;
				font-size: 28rpx;
				font-weight: 400;
			}
			.count{
				display: flex;
				flex-direction: column;
			}
			.truenum{
				display: flex;
				flex-direction: column;
			}
			.time{
				display: flex;
				flex-direction: column;
			}
		}
		.showbtn{
			border-radius: 40rpx;
			background-color: #2E996C;
			height: 80rpx;
			width: 300rpx;
			color: #fff;
			margin: 0 auto;
			font-size: 32rpx;
		}
		.return_index{
			position: fixed;
			z-index: 4;
			width: 90%;
			height: 100rpx;
			border-radius: 50rpx;
			text-align: center;
			line-height: 100rpx;
			bottom: 100rpx;
			font-size: 32rpx;
			color: #fff;
			margin: 0 auto;
			left: 0;
			right: 0;
			background-color:#2E996C;
		}
	}
</style>
